@import 'theme';
@import 'functions';
@import 'mixins';

//error page variables
$cx-error-align: center !default;
$cx-error-img-trbl-margin: 0 auto 30px auto !default;

$cx-error-message-font-weight: $font-weight-semi !default;
$cx-error-message-trbl-padding: 0 20px 0 20px !default;

$cx-error-message-span-sm-trbl-margin: 29px 0 0 0 !default;

.cx-error {
  text-align: $cx-error-align;

  &--message {
    @include type('4');
    font-weight: $cx-error-message-font-weight;
    padding: $cx-error-message-trbl-padding;

    span {
      display: block;
      @include media-breakpoint-down(sm) {
        margin-top: $cx-error-message-span-sm-trbl-margin;
      }
    }
  }
}

.cx-error__img {
  margin: $cx-error-img-trbl-margin;
  display: block;
}
